Ext.namespace("MyApp.views.logout_confirmation").logout_confirmation = new function() {
  var pageId = 'MyApp.views.logout_confirmation.logout_confirmation';
  
  function addInstance() {
    if(MyApp.views.viewport.getComponent(pageId) == null) {
      MyApp.views.viewport.add(getInstance());
    }
  };
  
  function prepareOptions(options, defaultOptions) {
    options = options?options:new Object();
    Ext.applyIf(options, defaultOptions);
    
    return options;
  }
  
  function display(options) {
    var defaultOptions = {
      animation: {
        type: 'slide',
        cover: true,
        direction: 'up'
      }
    };
    
    options = prepareOptions(options, defaultOptions);
    
    addInstance();
    
    MyApp.views.viewport.setActiveItem(pageId, options.animation);
  }
  this.display = display;
  
  function getInstance() {
    var toolbar = new Ext.Toolbar({
      dock : 'top',
      title: 'A Generic Touch App',
      items: [
        {xtype: 'spacer'}, 
        {
          text: 'Log in',
          listeners: {
            tap: function() {
              MyApp.views.login.login_form.display();
            }
          }
        }
      ]
    });
    
    return new Ext.Panel({
      id: pageId,
      layout: 'fit',
      
      styleHtmlContent: true,
      html: '<h1>You have been logged out.</h1>Welcome back.',
      
      dockedItems: [toolbar]
    });
  }
}();